<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <title>通过WebSocket获取bilibili直播弹幕</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="../weixin/css/amazeui.min.css" />
    <script src="pako.js"></script>
</head>

<body>

<div id="sse">
    <div>
        <span>url:</span>
        <input type="text" id="url" value="wss://broadcastlv.chat.bilibili.com/sub">
    </div>
    <div>
        <span>roomid:</span>
        <input type="text" id="roomid" value="21569100">
    </div>
<!--     <div>
        <span>key</span>
        <textarea id="key" cols="30" rows="10">81p2t7xxh6MmAz0pCFZxcbNglVd8Ao846GHF1S9BHEvfh_REfuOxWugDtqgqPnPYQhfSCCsB8ghzV5Y2Urb5FaZW-2pmO7q0Fsm32hxueRt9Yi-OPsV-Bp5lxothWUejvkIOiRHyN__MO5co</textarea>
    </div>-->
    <div>
        <a href="javascript:WebSocketTest()">登录</a>
    </div>

    <!--聊天内容-->
    <div class="windows_body">
        <div class="office_text" style="height: 100%;">
            <ul class="content" id="chatbox">
                <li class="me"><img src="../weixin/images/head/2.jpg" title=""><span>发送弹幕</span></li>
                <li class="other"><img src="../weixin/images/head/5.jpg" title=""><span>ok</span></li>
            </ul>
        </div>
    </div>

    <div class="windows_input" id="talkbox">
        <div class="input_icon">
            <a href="javascript:;"></a>
            <a href="javascript:;"></a>
            <a href="javascript:;"></a>
            <a href="javascript:;"></a>
            <a href="javascript:;"></a>
            <a href="javascript:;"></a>
        </div>
<!--        <div class="input_box">
            <textarea name="" rows="" cols="" id="input_box"></textarea>
            <button id="send">发送（S）</button>
        </div>-->
    </div>

</div>
</body>
<script type="text/javascript" src="../weixin/js/jquery.min.js"></script>
<script type="text/javascript" src="../weixin/js/amazeui.min.js"></script>
<script type="text/javascript" src="../weixin/js/zUI.js"></script>
<script type="text/javascript" src="../weixin/js/wechat.js"></script>
<script type="text/javascript" src="main.js"></script>

<script type="text/javascript">
    //三图标
    window.onload=function(){
        function b(){
            var text = document.getElementById('input_box');
            var chat = document.getElementById('chatbox');
            // var btn = document.getElementById('send');
            var talk = document.getElementById('talkbox');
            btn.onclick=function(){
                if(text.value ==''){
                    alert('不能发送空消息');
                }else{
                    chat.innerHTML += '<li class="me"><img src="'+'../weixin/images/own_head.jpg'+'"><span>'+text.value+'</span></li>';
                    text.value = '';
                    chat.scrollTop=chat.scrollHeight;
                    talk.style.background="#fff";
                    text.style.background="#fff";
                };
            };
        };
        b();
    };
</script>
</html>